<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
		<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/dojo/1.5/dijit/themes/soria/soria.css" />
		<style type="text/css">
			  @import "/FinalProject/style/inventory.css";
		</style>		
		<style type="text/css">
	        @import "http://ajax.googleapis.com/ajax/libs/dojo/1.5/dijit/themes/soria/soria.css";
	        @import "http://ajax.googleapis.com/ajax/libs/dojo/1.5/dojox/grid/resources/soriaGrid.css";
	        @import "http://ajax.googleapis.com/ajax/libs/dojo/1.5/dojox/grid/resources/Grid.css";   
	        @import "http://ajax.googleapis.com/ajax/libs/dojo/1.5/dojo/resources/dojo.css"; 
        </style>		
		<style type="text/css">
			body {
				width:1000px;
				margin:auto;
			}
		</style>
		<title>Administrator console of inventory DB</title>
		<script src="http://ajax.googleapis.com/ajax/libs/dojo/1.5/dojo/dojo.xd.js" type="text/javascript" djConfig='parseOnLoad:true,dojoBlankHtmlUrl:"/FinalProject/blank.html"'></script>
		<script type="text/javascript">
			dojo.require("dojo.parser");
			dojo.require("dijit.form.TextBox");
			dojo.require("dijit.form.ValidationTextBox");
			dojo.require("dijit.layout.ContentPane");
			dojo.require("dijit.layout.TabContainer");
			dojo.require("dojo.data.ItemFileWriteStore");
			dojo.require("dojox.grid.DataGrid");
			dojo.require("dijit.Dialog");
			dojo.require("dijit.form.DateTextBox");
			dojo.require("dijit.form.ComboBox");
			dojo.require("dojox.widget.Toaster");
			dojo.require("dijit.layout.AccordionContainer");
			dojo.require("dojo.io.iframe"); 
		</script>
		<script type="text/javascript" src="/FinalProject/jsLib/projects.js">
		</script>
		<script type="text/javascript" src="/FinalProject/jsLib/layouts.js">
		</script>
		<script type="text/javascript" src="/FinalProject/jsLib/admin.js">
		</script>
		<script type="text/javascript"><!--
		
			
			userGridState = {
				currentGrid 	: null,
				filterQueryMap	: {
					activeGrid 		: { userLogin: "*"},
					disabledGrid	: { userLogin: "*"},
					waitingGrid		: { userLogin: "*"}
				}
			};

			projectGridState = {
				currentGrid 	: null,
				filterQueryMap	: {
					projectsGrid 	: { projectName : "*"}
				}
			};

			instrumentsGridState = {
				currentGrid		: null,
				filterQueryMap 	: {
					instrumentsGrid : { type : "*" }
				}
			};
		    dojo.addOnLoad( function( ) {
			    userGridState.currentGrid = dijit.byId( "waitingGrid");
			    // Refresh list for updates
		    	dijit.byId( "activeList").refresh();
		    	dijit.byId( "disabledList").refresh();
		    	// To update grid information once in two minutes
		    	var intervalId = setInterval( function() {
		    		dijit.byId( "waitingList").refresh();
			    	dijit.byId( "activeList").refresh();
			    	dijit.byId( "disabledList").refresh();
		    	}, 2 * 60 * 1000);
		    	rolesStore = new dojo.data.ItemFileWriteStore( { url: "/FinalProject/app/listAvailableRoles", clearOnClose: true, jsId:"rolesStore"  } );
		    	
		    });   
		</script>	
	</head>
	<body class="soria" style="background-color: #CCCCCC">
		<jsp:include page="/templates/header.jsp" />
		 <div dojoType="dojox.widget.Toaster" id="toaster" positionDirection="tr-left">
		</div>
		<div style="width:1000px;height:1000px">
			<div dojoType="dijit.layout.TabContainer" style="width:100%;height:100%">
				<div dojoType="dijit.layout.ContentPane" title="User management" closable="false" id="userMangement" onShow="dijit.byId('userOrdersList').refresh( );">
					<form style="font-size:small">
						<fieldset>	
							<legend>
								Filter users
							</legend>
							<table>
								<tr>
									<td>
										<label>Login name:</label>
										<input type="text" dojoType="dijit.form.TextBox" id="userLoginFilter" onKeyUp="filterUserGrid( this);" />
									</td>
									<td>
										<label>First name:</label>
										<input type="text" dojoType="dijit.form.TextBox" id="userFirstNameFilter" onKeyUp="filterUserGrid( this);" />
									</td>
									<td>
										<label>Last name:</label>
										<input type="text" dojoType="dijit.form.TextBox" id="userLastNameFilter" onKeyUp="filterUserGrid( this);" />
									</td>
									<td>
										<label>Phone number:</label>
										<input type="text" dojoType="dijit.form.TextBox" id="userPhoneNumberFilter" onKeyUp="filterUserGrid( this);" />
									</td>
									<td>
										<button dojoType="dijit.form.Button" onClick="resetUserGridFilter( );">Reset filter</button>
									</td>
								</tr>
							</table>
						</fieldset>
					</form>	
					<div>
						<button name="newUserBtn" dojoType="dijit.form.Button" type="button" id="newUserBtn" onClick="newUserBtnHandler">Insert new user</button>
						<button name="deleteUserBtn" dojoType="dijit.form.Button" id="deleteUserBtn">
							Delete user
							<script event="onClick" args="event" type="dojo/method">
								if ( !userGridState.currentGrid && userGridState.currentGrid.selection.getSelected( ) == 0) {
									dijit.byId( "toaster").setContent( "Please select user to be deleted first", "fatal");
									dijit.byId( "toaster").show( );
									return;
								} 
								if ( userGridState.currentGrid.selection.getSelected( )[0].userLogin[0] == "<%= request.getUserPrincipal().getName()%>") {
									dijit.byId( "toaster").setContent( "You cannot delte yourself", "fatal");
									dijit.byId( "toaster").show( );
									return;
								}
								dojo.xhrPost( {
									url : "/FinalProject/app/userManagement?userOp=user_delete",
									content : userGridState.currentGrid.selection.getSelected( )[0],
									load : function( data, ioArgs) {
										if ( data == "ERROR") {
											dijit.byId( "toaster").setContent( "Could not delete selected user", "fatal");
											dijit.byId( "toaster").show( );
											return;
										}
										dijit.byId( "toaster").setContent( "User deleted successful", "fatal");
										dijit.byId( "toaster").show( );
										userGridState.currentGrid.removeSelectedRows( );
										if ( dijit.byId( "userOrdersGrid")) {
											dijit.byId( "userOrdersGrid").store.close( );
											dijit.byId( "userOrdersGrid").store.fetch( );
										}
										if ( dijit.byId( "personalGrid")) {
											dijit.byId( "personalGrid").store.close( );
											dijit.byId( "personalGrid").store.fetch( );
										}
										if ( dijit.byId( "projectOrdersGrid")) {
											dijit.byId( "projectOrdersGrid").store.close( );
											dijit.byId( "projectOrdersGrid").store.fetch( );
										}
										return;
									},
									error : function( data) {
										dijit.byId( "toaster").setContent( "Backend error, could not delete selected user", "fatal");
										dijit.byId( "toaster").show( );
										return;
									}
								});
							</script>
						</button>
					</div>								
					<div dojoType="dijit.layout.AccordionContainer" style="width:100%;height:300px" id="userAccordion">
						<div dojoType="dijit.layout.ContentPane" title="Waiting list (user waiting activation)." closable="false" id="waitingList" href="/FinalProject/templates/users/waitingList.jsp" onShow="showUsersList( 'waitingGrid');">
							waiting
						</div>
						<div dojoType="dijit.layout.ContentPane" title="Active users." closable="false" id="activeList" href="/FinalProject/templates/users/activeList.jsp" onShow="showUsersList( 'activeGrid');">
							active
						</div>
						<div dojoType="dijit.layout.ContentPane" title="Disabled users." closable="false" id="disabledList" href="/FinalProject/templates/users/disabledList.jsp" onShow="showUsersList( 'disabledGrid');">
							disabled
						</div>
					</div>
					<div dojoType="dijit.layout.ContentPane" style="width:100%;height:400px" id="userOrdersList" href="/FinalProject/templates/orders/userOrders.jsp">
					</div>
				</div>
				<div dojoType="dijit.layout.ContentPane" title="Projects management" closable="false" id="projectMangement" onShow="projectGridState.currentGrid=dijit.byId('projectsGrid');dijit.byId('projectsList').refresh( );" onLoad="projectGridState.currentGrid=dijit.byId('projectsGrid');">
					<form style="font-size:small">
						<fieldset>
							<legend>
								Filter projects
							</legend>
							<table>
								<tr>
									<td>
										<label>Project name:</label>
										<input type="text" dojoType="dijit.form.TextBox" id="projectNameFilter" onKeyUp="filterProjectGrid( this);" />
									</td>
									<td>
										<label>Project description</label>
										<input type="text" dojoType="dijit.form.TextBox" id="projectDescriptionFilter" onKeyUp="filterProjectGrid( this);"/>
									</td>
									<td>
										<button dojoType="dijit.form.Button" onClick="resetProjectGridFilter( )">Reset filter</button>
									</td>
								</tr>
							</table>
						</fieldset>
					</form>
					<form style="font-size:small">
						<table>
							<tr>
								<td>
									<button dojoType="dijit.form.Button" onClick = "Projects.projectDialog">
										Add new project
									</button>								
								</td>
								<td>
									<button dojoType="dijit.form.Button" onClick = "Projects.deleteProject">
										Delete project
									</button>
								</td>
							</tr>
						</table>
					</form>
					<div dojoType="dijit.layout.ContentPane" title="Projects list" id="projectsList" closable="false" href="/FinalProject/templates/projects/projectsList.jsp">
					</div>
				</div>				
				<div dojoType="dijit.layout.ContentPane" title="Resources management" closable="false" id="instrManagement" href="/FinalProject/templates/instruments/instruments.jsp" onShow="this.refresh( );">
				</div>
				<div dojoType="dijit.layout.ContentPane" title="Report generation" closable="false" id="reportGeneration" href="/FinalProject/templates/xslt/xsltStorage.jsp" onShow="this.refresh( );">
				</div>
			</div>
		</div>
	</body>
</html>